<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE HTML>
<html>
  <head>
    
    <title>student</title>
	<jsp:include page="/util/head.jsp"></jsp:include>
	<script type="text/javascript">
		$(function(){
		
			$('.openEdit').click(function(){
				var studentId = $(this).attr('studentId');
				var student = {};
				if(studentId!=null){
					$.ajax({
						url : '/getStudentById.action',
						data : {'studentId' : studentId},
						async : false,//同步
						success : function(data){
							student = data;
						},
						error : function(){
							alert('你真坏');
						}
					});
				}
				$('#divEdit input[name="student.studentId"]').val(student.studentId);
				$('#divEdit input[name="student.realName"]').val(student.realName);
				$('#divEdit select[name="student.classes.classId"]').val(student.classId);
				$('#divEdit').showToast();
				return false;
			});
		
			$('#aSave').click(function(){
				$('#formEdit').submit();
				return false;
			});
			
			$('.openDel').click(function(){
				$('#divDelConfirm span.rname').text($(this).attr('realName'));
				$('#divDelConfirm a.aConfirm').attr('href','/delStudent.action?studentId='+$(this).attr('studentId'));
				$('#divDelConfirm').showToast();
				return false;
			});
			
		});
	</script>
  </head>
  
  <body>
    
    <div class="toolDiv">
    	<a href="" class="aBtn openEdit">添加</a>
    </div>
    
    <table cellpadding="0" cellspacing="1" class="tableList">
    	<colgroup>
    		<col width="40"/>
    		<col width="100"/>
    		<col width="100"/>
    		<col width="100"/>
    		<col width="100"/>
    		<col/>
    	</colgroup>
    	<tr class="trTitle">
    		<th></th>
    		<th>照片</th>
    		<th>学号</th>
    		<th>姓名</th>
    		<th>班级</th>
    		<th>操作</th>
    	</tr>
    	<c:forEach var="item" items="${list}" varStatus="vs">
    		<tr>
    			<td class="xh">${vs.count}</td>
    			<td><img src="${item.avatar}" style="max-width:30px;"/></td>
    			<td>${item.studentId}</td>
    			<td>${item.realName}</td>
    			<td>${item.classes.className}</td>
    			<td class=opTd>
    				<a href="" class="openEdit" studentId="${item.studentId}">修改</a> |
    				<a href="" class="openDel" studentId="${item.studentId}" realName="${item.realName}">删除</a>
    			</td>
    		</tr>
    	</c:forEach>
    </table>
    
    <div class="translucent"></div>
    <div class="promptToast" id="divEdit" style="margin-left:-160px; margin-top:-125px;">
    	<div class="title">编辑信息<a href="" class="close">×</a></div>
    	<div class="content">
    		<form action="/saveStudent.action" method="post" id="formEdit" enctype="multipart/form-data">
    			<p class="item"><label>学号</label><input type="text" name="student.studentId" class="inp" readonly="readonly"/></p>
    			<p class="item"><label>姓名</label><input type="text" name="student.realName" class="inp"/></p>
    			<p class="item">
    				<label>班级</label>
    				<select class="inp" name="student.classes.classId">
    					<option value="">请选择</option>
    					<c:forEach var="item" items="${classesList}">
    						<option value="${item.classId}">${item.className}</option>
    					</c:forEach>
    				</select>
    			</p>
    			<p class="item">
	    			<label>照片</label><input type="file" name="avatarFile" class="inp" onchange="$('[name=avatarFileName]').val(this.value.substring(this.value.lastIndexOf('\\')+1));"/>
	    			<input type="hidden" name="avatarFileName" class="inp"/>
	    		</p>
    		</form>
    	</div>
    	<div class="btns">
    		<a href="" class="aBtn" id="aSave">保存</a>
    		<a href="" class="aBtn close">关闭</a>
    	</div>
    </div>
    
    <div class="promptToast" id="divDelConfirm" style="margin-left:-160px;margin-top:-125;">
    	<div class="title">确定删除<a href="" class="close">×</a></div>
    	<div class="content">
    		<p class="item">确定删除学生<span class="rname" style="color:#000;"></span> 的信息？</p>
    	</div>
    	<div class="btns">
    		<a href="" class="aBtn aConfirm">确定</a>
    		<a href="" class="aBtn close">取消</a>
    	</div>
    </div>
    
  </body>
</html>
